/* light */
:root {
    --global-border: #d8dee4;
    --global-color: #000000;
    --global-bg: #ffffff;
}

/* dark */
.sl-theme-dark {
    --global-border: #585b60;
    --global-color: #d4d4d4;
    --global-bg: #0d1117;
}

    .sl-theme-dark body {
        color: var(--global-color);
        background-color: var(--global-bg);
    }

    /*scrollbar*/
    .sl-theme-dark *::-webkit-scrollbar-track-piece {
        background: transparent
    }

    .sl-theme-dark *::-webkit-scrollbar {
        background-color: #202022
    }

    .sl-theme-dark *::-webkit-scrollbar-thumb {
        background-color: #585859;
        min-height: 24px;
        border: 3px solid #202022
    }

        .sl-theme-dark *::-webkit-scrollbar-thumb:focus {
            background-color: #838384
        }

        .sl-theme-dark *::-webkit-scrollbar-thumb:active {
            background-color: #838384
        }

    .sl-theme-dark *::-webkit-scrollbar-corner {
        background-color: #202022
    }

    /*link*/
    .sl-theme-dark a,
    .sl-theme-dark .markdown-body a {
        text-decoration: none;
        color: var(--sl-color-primary-600);
    }

        .sl-theme-dark a:hover,
        .sl-theme-dark .markdown-body a:hover {
            text-decoration: underline;
            color: var(--sl-color-primary-700);
        }

    /*Pagination*/
    .sl-theme-dark .page-link,
    .sl-theme-dark .page-item.disabled .page-link {
        background-color: var(--sl-color-primary-100);
        border-color: var(--sl-color-primary-600);
        color: var(--sl-color-neutral-0);
    }

        .sl-theme-dark .page-link:hover {
            background-color: var(--sl-color-primary-500);
            color: var(--sl-color-neutral-0);
        }

    /*bootstrap*/
    .sl-theme-dark .form-control {
        background: currentColor;
        border: solid var(--sl-input-border-width) var(--sl-input-border-color);
    }

    .sl-theme-dark .border {
        border-color: var(--sl-color-neutral-400) !important;
    }

    /*markdown*/
    .sl-theme-dark .markdown-body, .sl-theme-dark .markdown-body pre code {
        color: currentColor;
    }

        .sl-theme-dark .markdown-body table tr {
            background-color: var(--sl-color-neutral-0);
        }

            .sl-theme-dark .markdown-body table tr:nth-child(2n) {
                background-color: var(--sl-color-neutral-100);
            }
